<template>
	<view>
		<cover-view class="video-control">
			<cover-view class="loading-box" v-if="!isLoading&&url">
				<!-- <cover-view class="loading">设备连接个数{{viewerNum}}</cover-view> -->
				<cover-view class="loading">{{netSpeed}}</cover-view>
			</cover-view>
			<!-- 加载提示信息 -->
			<cover-view class="loading-box" v-if="isLoading">
				<cover-view class="loading">{{ loadingText }}</cover-view>
			</cover-view>
			<!-- auto 全屏 -->
			<cover-view class="rightV" v-else>
				<cover-view class="right">
					<cover-view class="auto" :class="{'autoActive':fitType=='fillCrop'}" @tap.stop.prevent="onAutoAction">AUTO</cover-view>
					<cover-image :src="isFullScreen?'https://statics.xmcsrv.net/weixin/video-fullScreenExit.png':'https://statics.xmcsrv.net/weixin/video-fullscreen.png'" class="img" @tap.stop.prevent="onBindtapFullScreen"></cover-image>
				</cover-view>
				<cover-image v-if="isWifiSignal" :src="wifiUrl" class="img"></cover-image>
			</cover-view>
			
			
			<!-- 顶控制条 -->
			<cover-view class="topbar" v-if="isShowBar">
				<cover-view style="display: flex; justify-content: flex-start; align-items: center">
					<cover-view class="icon" style="background: #FF0025;" @tap.stop.prevent="onBindtapExitFullScreen" v-if="isFullScreen">
						<cover-image src="https://statics.xmcsrv.net/weixin/video-back.png" class="img"></cover-image>
						<!-- <uni-icons custom-prefix="iconfont" type="icon-jiantou-copy-copy-copy" size="24" color="#FFFFFF" style="transform: rotate(-90deg);"></uni-icons> -->
					</cover-view>
				</cover-view>
				<cover-view style="display: flex; justify-content: flex-end; align-items: center">
					<cover-view class="icon" style="background: #FF0025;" @tap.stop.prevent="onBindtapExitFullScreen" v-if="isFullScreen">
						<cover-image src="https://statics.xmcsrv.net/weixin/video-fullScreenExit.png" class="img"></cover-image>
						<!-- <uni-icons custom-prefix="iconfont" type="icon-tuichuquanping-02" size="24" color="#FFFFFF"></uni-icons> -->
					</cover-view>
					<cover-view class="icon" @tap.stop.prevent="onBindtapFullScreen" v-else>
						<cover-image src="https://statics.xmcsrv.net/weixin/video-fullscreen.png" class="img"></cover-image>
						<!-- <uni-icons custom-prefix="iconfont" type="icon-fullscreen" size="24" color="#FFFFFF"></uni-icons> -->
					</cover-view>
				</cover-view>
			</cover-view>
		</cover-view>

		<!-- 截图 -->
		<cover-image :src="captureUrl" v-if="isCapture" class="capture"></cover-image>
		<!-- :class="{'isFull':isFullScreen}" -->
		<view class="" style="position: relative;" >
			<!-- 生成全景图按钮 -->
			<!-- <cover-image src="https://statics.xmcsrv.net/weixin/video-fullScreenExit.png" class="scene" @tap.stop.prevent="onBindtapOverallView"></cover-image> -->
			<!-- <live-player id="livePlayer" class="" :src="url" :min-cache="cacheMinTime" :object-fit="fitType" :orientation="orientation" :muted="isMute" :max-cache="cacheMaxTime" autoplay @statechange="statechange" @error="error" @fullscreenchange="fullscreenchange" style="width: 100%;height:550rpx" :style="{width:isFullScreen?screenHeight:'100%',height:isFullScreen?screenWidth:'550rpx'}"/> -->
			<live-player id="livePlayer" class="" :src="url" :min-cache="cacheMinTime" :object-fit="fitType" :orientation="orientation" :muted="isMute" :max-cache="cacheMaxTime" autoplay @statechange="statechange" @netstatus="netstatusChange" @error="error" @fullscreenchange="fullscreenchange" style="width: 100%;height:580rpx">
				<cover-view class="rightV" v-if="!isLoading">
					<cover-view class="right">
						<cover-view class="auto" :class="{'autoActive':fitType=='fillCrop'}" @tap.stop.prevent="onAutoAction">AUTO</cover-view>
						<cover-image :src="isFullScreen?'https://statics.xmcsrv.net/weixin/video-fullScreenExit.png':'https://statics.xmcsrv.net/weixin/video-fullscreen.png'" class="img" @tap.stop.prevent="onBindtapFullScreen"></cover-image>
					</cover-view>
					<cover-image v-if="isWifiSignal" :src="wifiUrl" class="img"></cover-image>
				</cover-view>
			</live-player>
		</view>
		<!-- 控制条 -->
		<view>
			<view class="video-control-extra" style="position: relative;" >
				<view v-if="isShowCloudPanel" class="cloudPanel">
					<template>
						<j-cell-group>
							<j-cell @jftap="onBindtapCloud" v-if="isCloud" subTitle="查看云存储历史记录">
								<view slot="icon" class="cellIcon">
									<image src="https://statics.xmcsrv.net/weixin/cloud/icon/xmcCss.png" mode=""></image>
								</view>
								<view slot="title">
									<view>云回看</view>
								</view>
								<view slot="tips">
									<template v-if="cloudText === '未开通'">
										<text style="color: orangered; font-size: 26rpx">{{ cloudText }}</text>
									</template>
									<template v-else-if="cloudText == '已过期'">
										<text style="color: orangered; font-size: 26rpx">{{ cloudText }}</text>
									</template>
									<template v-else></template>
								</view>
							</j-cell>
							<j-cell title="卡回看" @jftap="onBindtapReplay" subTitle="查看卡存储历史记录">
								<view slot="icon" class="cellIcon">
									<image src="https://statics.xmcsrv.net/weixin/cloud/icon/cardIcon.png" mode=""></image>
								</view>
							</j-cell>
						</j-cell-group>
					</template>
				</view>
				<button class="jf-button" @tap="onBindShare">
					<uni-icons custom-prefix="iconfont" type="icon-fenxiang" size="24"></uni-icons>
					<view style="font-size: 24rpx; font-weight: normal">分享</view>
				</button>

				<button class="jf-button" @tap="onBindtapSDFHD">
					<view style="line-height: 1.75;">{{ streamTextIcon }}</view>
					<view style="font-size: 24rpx; font-weight: normal">{{ streamText }}</view>
				</button>
				
				<button v-if="isFeeder" class="jf-button" @tap="onShowCloud()">
					<image :src="isShowCloudPanel?'https://statics.xmcsrv.net/weixin/cloudServcieActive.png':'https://statics.xmcsrv.net/weixin/cloudService.png'" style="width:60rpx;height:60rpx"></image>
					<view style="font-size: 24rpx; font-weight: normal">云服务 </view>
				</button>
				
				<button class="jf-button" @tap="onBindtapMuted">
					<image :src="mutedIcon" style="width:60rpx;height:60rpx"></image>
					<view style="font-size: 24rpx; font-weight: normal">静音 </view>
				</button>
				
				<!-- <button class="jf-button" @tap="onBindtapCapture">
					<uni-icons custom-prefix="iconfont" type="icon-paizhao-xianxing" size="24"></uni-icons>
					<view style="font-size: 24rpx; font-weight: normal">拍照</view>
				</button> -->

				<!-- <button class="jf-button" bindtap="onBindtapCapture">
					<uni-icons custom-prefix="iconfont" type="icon-luxiang" size="24"></uni-icons>
					<view style="font-size:24rpx;font-weight:normal;">录制</view>
				</button> -->
				 <!-- v-if="isSupportNew||isSupportOld" -->
				<button v-if="isSupportNew||isSupportOld" class="jf-button" @tap="onBindtapControl">
					<uni-icons custom-prefix="iconfont" type="icon-zidongkongzhi" size="24"></uni-icons>
					<view style="font-size: 24rpx; font-weight: normal">操控</view>
				</button>

				<button class="jf-button" @tap="onBindtapSetting">
					<uni-icons custom-prefix="iconfont" type="icon-settings" size="24"></uni-icons>
					<view style="font-size: 24rpx; font-weight: normal">设置</view>
				</button>
			</view>
		</view>

		<!-- 云存储 -->
		<template v-if="!isFeeder">
			<j-cell-group>
				<j-cell @jftap="onBindtapCloud" v-if="isCloud" subTitle="查看云存储历史记录">
					<view slot="icon" class="cellIcon">
						<image src="https://statics.xmcsrv.net/weixin/cloud/icon/xmcCss.png" mode=""></image>
					</view>
					<view slot="title">
						<view>云回看</view>
					</view>
					<view slot="tips">
						<template v-if="cloudText === '未开通'">
							<text style="color: orangered; font-size: 26rpx">{{ cloudText }}</text>
						</template>
						<template v-else-if="cloudText == '已过期'">
							<text style="color: orangered; font-size: 26rpx">{{ cloudText }}</text>
						</template>
						<template v-else></template>
					</view>
				</j-cell>
			</j-cell-group>
			
			<j-cell-group>
				<j-cell title="卡回看" @jftap="onBindtapReplay" subTitle="查看卡存储历史记录">
					<view slot="icon" class="cellIcon">
						<image src="https://statics.xmcsrv.net/weixin/cloud/icon/cardIcon.png" mode=""></image>
					</view>
				</j-cell>
			</j-cell-group>
		</template>
		<!-- 一键喂食 -->
		<view v-if="isFeeder" style="margin-top: 30rpx;">
			<view class="">
				<scroll-view :scroll-x="true" class="u-f-r" style="width: 100%;white-space: nowrap;">
					<view class="" style="width: 20%;display: inline-block;"  v-for="(item,index) in feedNumList" :key="index" @click="choosefeedNum(item)">
						<view class="feedNum u-f-ajc" :class="{'activeFeed':feedNum == item}">{{item}}</view>
					</view>
				</scroll-view>
				<view class="choNum">选择喂食份数</view>
			</view>
			<view class="u-f-c u-f-ajc" style="margin-top: 50rpx;" @click="oneClickFeeding">
				<image class="feedIcon" src="https://statics.xmcsrv.net/weixin/oneFeeding.png" mode=""></image>
				<view class="" style="color: #989898;">一键喂食</view>
			</view>
		</view>
		
		<j-cell-group v-if="device.pid === constant.DEVICE_TYPE.EE_DEV_BOUTIQUEROBOT || device.pid === constant.DEVICE_TYPE.EE_DEV_NORMAL_MONITOR">
			<j-cell title="灯光警戒" @jftap="onBindLightWarning" subTitle="设置灯光警戒">
				<view slot="icon" class="cellIcon">
					<image src="https://statics.xmcsrv.net/weixin/cloud/icon/warnIcon.png" mode=""></image>
				</view>
			</j-cell>
		</j-cell-group>

		<!-- 登录 -->
		<j-device-login ref="deviceLogin" :device="device" @submit="submit"></j-device-login>
		
		<!-- 控制面板 -->
		<uni-popup ref="popupControl" type="bottom">
			<view style="width:100vw;height: 50vh; background: #FFFFFF;">
				<view style="display: flex; justify-content: space-between; align-items: center; padding:20rpx;">
					<view class="button-jf block" style="margin-left: 10rpx;text-align: center;">
						<picker @change="bindchangeStep" :value="step" :range="stepList">
							<view>步长：{{ stepList[step] }}</view>
						</picker>
					</view>
					<view class="button-jf block" style="margin-left: 10rpx;text-align: center;" @tap="bindtapPreset">
						预置点
					</view>
					<view class="button-jf block" style="margin-left: 10rpx;text-align: center;" @tap="bindtapCruise">
						点间巡航
					</view>
					<view class="button-jf block" style="margin-left: 10rpx;text-align: center;" @tap="bindtapMobileTracking">
						移动追踪
					</view>

					<!-- <button size="mini" type="primary" class="block" style="margin-left: 10rpx" plain @tap="bindtapPreset">预置点</button>
					<button size="mini" type="primary" class="block" style="margin-left: 10rpx" plain @tap="bindtapCruise">点间巡航</button> -->
					<!-- <button size="mini" type="primary" class="block" style="margin-bottom: 10rpx" plain @tap="bindtapPositionReset">云台校正</button> -->
				</view>
				<view style="widht:100vw; height:40vh;display: flex;justify-content: center; align-items: center;">
					<!-- 控制手柄 -->
					<view class="control-inner">
						<uni-icons custom-prefix="iconfont" type="icon-arrow-control" size="24"
							:color="type === 'up'?'#FF0025':'#777777'" class="control-handle control-top"
							@touchstart="onBindtouchstart('up')" @touchend="onBindtouchend('up')"></uni-icons>
						<uni-icons custom-prefix="iconfont" type="icon-arrow-control" size="24"
							:color="type === 'rightup'?'#FF0025':'#777777'" class="control-handle control-top-right"
							@touchstart="onBindtouchstart('rightup')" @touchend="onBindtouchend('rightup')"></uni-icons>
						<uni-icons custom-prefix="iconfont" type="icon-arrow-control" size="24"
							:color="type === 'right'?'#FF0025':'#777777'" class="control-handle control-right"
							@touchstart="onBindtouchstart('right')" @touchend="onBindtouchend('right')"></uni-icons>
						<uni-icons custom-prefix="iconfont" type="icon-arrow-control" size="24"
							:color="type === 'rightdown'?'#FF0025':'#777777'"
							class="control-handle control-right-bottom" @touchstart="onBindtouchstart('rightdown')"
							@touchend="onBindtouchend('rightdown')"></uni-icons>
						<uni-icons custom-prefix="iconfont" type="icon-arrow-control" size="24"
							:color="type === 'bottom'?'#FF0025':'#777777'" class="control-handle control-bottom"
							@touchstart="onBindtouchstart('bottom')" @touchend="onBindtouchend('bottom')"></uni-icons>
						<uni-icons custom-prefix="iconfont" type="icon-arrow-control" size="24"
							:color="type === 'leftdown'?'#FF0025':'#777777'" class="control-handle control-bottom-left"
							@touchstart="onBindtouchstart('leftdown')" @touchend="onBindtouchend('leftdown')">
						</uni-icons>
						<uni-icons custom-prefix="iconfont" type="icon-arrow-control" size="24"
							:color="type === 'left'?'#FF0025':'#777777'" class="control-handle control-left"
							@touchstart="onBindtouchstart('left')" @touchend="onBindtouchend('left')"></uni-icons>
						<uni-icons custom-prefix="iconfont" type="icon-arrow-control" size="24"
							:color="type === 'leftup'?'#FF0025':'#777777'" class="control-handle control-left-top"
							@touchstart="onBindtouchstart('leftup')" @touchend="onBindtouchend('leftup')"></uni-icons>
						<view class="control-center"></view>
					</view>
				</view>
			</view>
		</uni-popup>

		<!-- 灯光警戒 -->
		<uni-popup ref="lightWarn" type="bottom">
			<view style="width:100vw;height: 45vh; background: #FFFFFF;">
				<scroll-view :scroll-y="true" style="padding:40rpx 0;height:470rpx;">
					<picker @change="bindControlPickerChange" range-key="title"  :range="controlModelList">
						<j-cell title="控制模式" :tips="controlModel" subTitle="星光全彩/红外夜观/双光警戒"></j-cell>
					</picker>
					<template v-if="controlModel == '双光警戒'">
						<picker @change="bindSensitivePickerChange" range-key="title" :range="lightSenstiveList">
							<j-cell title="灵敏度" :tips="lightSensitive"></j-cell>
						</picker>
						<picker @change="bindLightPickerChange" :range="lightTimeList">
							<j-cell title="持续亮灯时间" :tips="lightTime+'s'"></j-cell>
						</picker>
						<view style="position: relative;">
							<j-cell title="智能警戒" :to="`/jvss/pagesDevice/device/device-live/setting/smartWarn?device=${encodeURIComponent(JSON.stringify(device))}`"></j-cell>
						</view>
					</template>
				</scroll-view> 
				<view class="watchPos cancel" @click="closeLightWarn">取消</view>
			</view>
		</uni-popup>
		<!-- 移动追踪 -->
		<uni-popup ref="popupTrack" type="bottom">
			<view style="width:100vw;height: 620rpx; background: #FFFFFF;">
				<scroll-view :scroll-y="true" style="padding:40rpx 0;height:500rpx">
					<view class="trackTitle"><view class="line"></view>移动追踪</view>
					<j-cell title="移动追踪开关" :more="false">
						<view slot="tips">
							<j-switch  v-model="isTrackSwitch" color="#FF0025" @change="trackSwitchChange" ></j-switch>
							<!-- <switch ref="switch" :checked="isTrackSwitch" color="#FF0025" style="transform:scale(0.8)" @change="trackSwitchChange"></switch> -->
						</view>
					</j-cell>
					<view style="position: relative;">
						<j-cell title="灵敏度" :more="false" :tips="sensitivity" @jftap="onShowSensitive"></j-cell>
						<view class="senstive" v-if="isShowSensitive">
							<view class="item" v-for="(item,index) in senstiveList" :key="index" @click="chooseSensitive(item)">{{item.title}}</view>
						</view>
					</view>
					<view style="position: relative;">
						<j-cell title="守望时间" :more="false" :tips="watchTime" @jftap="onShowWatchTime"></j-cell>
						<scroll-view scroll-y="true" class="senstive" style="height:170rpx" v-if="isShowWatchTime">
							<view class="item" v-for="(item,index) in watchTimeList" :key="index" @click="chooseWatchTime(item)">{{item.title}}</view>
						</scroll-view>
						<!-- <view class="senstive" v-if="isShowWatchTime">
							<view class="item" v-for="(item,index) in watchTimeList" :key="index" @click="chooseWatchTime(item)">{{item.title}}</view>
						</view> -->
					</view>
					<view class="watchPos" @click="setWatchPosition">设为守望位置</view>
				</scroll-view> 
				<view class="watchPos cancel" @click="closeTrackPopup">取消</view>
			</view>
		</uni-popup>
		
		<!-- 预置点 -->
		<uni-popup ref="popupPreset" type="bottom">
			<view style="width:100vw;height: 50vh; background: #FFFFFF;">
				<view style="padding: 20rpx">
					<input :value="valuePreset" type="number" placeholder="有效值为1-255"
						style="width: 55vw; display: inline-block; padding: 10rpx; border-radius: 10rpx; background: #f6f6f6; border: 1px solid #efefef"
						@input="bindinput" />
					<button size="mini" style="display: inline-block; margin-left: 10rpx" :disabled="disabled"
						@tap="bindtapSet">设置</button>
				</view>
				<scroll-view :scroll-y="true" style="height: 60vw">
					<template v-for="(item, index) in presetData">
						<j-cell-group :key="index" :title="'通道' + index">
							<template v-for="(pro, size) in item">
								<j-cell :key="pro.size" :title="pro.PresetName" :more="false">
									<view slot="tips">
										<button type="primary" size="mini" plain :data-pro="pro"
											@tap="bindtapCall">调用</button>
										<button type="primary" size="mini" plain :data-pro="pro" @tap="bindtapDel"
											style="margin: 0 20rpx 0 10rpx">删除</button>
									</view>
								</j-cell>
							</template>
						</j-cell-group>
					</template>
				</scroll-view>
			</view>
		</uni-popup>

		<!-- 点间巡航 -->
		<uni-popup ref="popupCruise" type="bottom">
			<view style="width:100vw;height: 50vh; background: #FFFFFF;">
				<view
					style="display: flex; justify-content: space-around; align-items: center; text-align: center;padding:20rpx;">
					<view style="flex: 1">
						<view style="font-size: 24rpx;">巡航线路</view>
						<view
							style="background: #f6f6f6; padding: 20rpx; margin: 20rpx; border-radius: 10rpx; text-align: center; color: gray">
							1</view>
					</view>
					<view style="flex: 1">
						<view style="font-size: 24rpx;">预置点</view>
						<view>
							<picker @change="bindchangePreset" :value="preset" :range="presetList">
								<view
									style="background: #f6f6f6; padding: 20rpx; margin: 20rpx; border-radius: 10rpx; text-align: center">
									{{ presetList[preset] }}
								</view>
							</picker>
						</view>
					</view>
					<view style="flex: 1">
						<view style="font-size: 24rpx;">时间间隔</view>
						<view>
							<input type="number" v-model="time" maxlength="3"
								style="background: #f6f6f6; padding: 20rpx; margin: 20rpx; border-radius: 10rpx; text-align: center"
								@input="bindinputTime" />
						</view>
					</view>
				</view>
				<view style="padding: 20rpx">
					<view
						style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 20rpx">
						<view class="button-jf block" style="margin-left: 10rpx;text-align: center;"
							@tap="bindtapAddPreset">增加预置点</view>
						<view class="button-jf block" style="margin-left: 10rpx;text-align: center;"
							@tap="showDelPreset">删除预置点</view>
						<view class="button-jf block" style="margin-left: 10rpx;text-align: center;"
							@tap="bindtapClearCruise">清除巡航线路</view>
					</view>
					<view        
						style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 20rpx">
						<button :disabled="disabled2" type="primary" size="mini" class="block" @tap="bindtapStartCruise">开始巡航</button>
						<button :disabled="disabled3" type="default" size="mini" class="block" @tap="bindtapStopCruise"
							style="margin-left:10rpx;">结束巡航</button>
					</view>
				</view>
			</view>
		</uni-popup>

		<!-- 点间巡航-预置点集合 -->
		<uni-popup ref="popup" type="bottom">
			<view style="width: 100vw; height:50vh;background: #FFFFFF;" v-if="tourData.Tour">
				<scroll-view scroll-y="true" style="height: 50vh;">
					<j-cell-group :title="'线路' + tourData.Id">
						<template v-for="(item, index) in tourData.Tour">
							<j-cell :key="item.Id" :title="'预置点'+item.Id" :more="false">
								<view slot="tips">
									<button type="primary" size="mini" plain :data-item="item" @tap="bindtapDelPreset" style="margin: 0 20rpx 0 10rpx">删除</button>
								</view>
							</j-cell>
						</template>
					</j-cell-group>
				</scroll-view>
			</view>
			<view v-else class="cruise-empty">
				<view>
					<uni-icons custom-prefix="iconfont" type="icon-kong" size="64"></uni-icons>
					<view>暂无数据</view>
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	const {convertdBm2RSSI} = require('@/utils/util.js');
	const {isFeeder} = require('@/utils/util.js');
	let presetList = [];

	for (let i = 0; i < 255; i++) {
		let index = i + 1;

		// if (i < 10) {
		// 	index = '00' + index;
		// }

		// if (i >= 10 && i < 100) {
		// 	index = '0' + index;
		// }

		presetList.push(index);
	}

	export default {
		data() {
			return {
				// 设备对象
				device: {
					deviceName: ''
				},

				// 缓存列表
				deviceList: [],

				// 是否存在缓存
				isCache: false,

				//保活定时器
				timer: null,

				// 保活次数迭代变量
				keepAliveCount: 0,

				/** 推流相关 */
				// 视频对象
				videoContext: {},
				
				// 播放地址
				url: '',

				// 高清还是标清（标清用: 1 表示， 高清用: 0 表示）
				stream: '1',

				// 高清还是标清文本说明
				streamText: '标清',

				// 高清还是标清icon
				streamTextIcon: 'SD',
				
				//静音
				mutedIcon:'https://statics.xmcsrv.net/weixin/toolIcon0.png',
				isMute:true,

				/** 操控相关 */
				//操作方向
				type: '',

				// 是否支持操控（老设备）
				isSupportOld: false,

				// 是否支持操控（新设备）
				isSupportNew: false,
				
				isShowLightWarn:false,
				
				isWifiSignal:false,//显示wifi
				isSnapshot:false,//是否支持生成全景图片的能力

				//是否全屏
				isFullScreen: false,
				screenHeight:uni.getSystemInfoSync().screenWidth,
				screenWidth:uni.getSystemInfoSync().screenHeight,
				
				fitType:'contain' ,//填充模式 contain	图像长边填满屏幕，短边区域会被填充 fillCrop图像铺满屏幕，超出显示区域的部分将被截掉
				orientation:'vertical', //画面方向  horizontal水平

				// 显示隐藏bar控条
				isShowBar: true,
				
				//加载中
				isLoading: true,

				//加载中文字说明
				loadingText: '正在获取视频播放地址...',

				//截图
				captureUrl: '',

				// 显示截图
				isCapture: false,

				// 预置点的值
				valuePreset: '',

				// 已设置的预置点集合
				presetData: [],

				// 预置点操作按钮是否可用
				disabled: true,
				disabled2: false,
				disabled3:false,

				// 步长
				stepList: [1, 2, 3, 4, 5, 6, 7, 8],

				// 预置点集合
				step: 4,
				
				// 预置点集合
				presetList: presetList,

				// 预置点
				preset: 0,
				
				// 时间间隔
				time: 3,
				
				//已设置的巡航预置点集合
				tourData: {},

				/** 云服务 */
				isCloud: false,
				
				// 云存储文字说明
				cloudText: '',
				cacheMaxTime:1,
				cacheMinTime:10,
				isLogin:false,
				//移动追踪
				isTrackSwitch:false,
				sensitivity:'高级',
				watchTime:3,
				senstiveList:[{id:0,title:'低级'},{id:1,title:'中级'},{id:2,title:'高级'}],
				watchTimeList:[{id:0,title:'3秒',sec:3},{id:1,title:'5秒',sec:5},{id:2,title:'15秒',sec:15},{id:3,title:'30秒',sec:30},{id:4,title:'1分钟',sec:60},{id:5,title:'3分钟',sec:180},{id:6,title:'5分钟',sec:300},{id:7,title:'10分钟',sec:600},{id:8,title:'15分钟',sec:900},{id:9,title:'30分钟',sec:1800}],
				isShowSensitive:false,
				isShowWatchTime:false,
				humanDetectionQuery:{},
				trackQuery:{},
				//灯光警戒
				lightQuery:{},
				lightSenstiveList:[{id:1,title:'低级'},{id:3,title:'中级'},{id:6,title:'高级'}],
				controlModel:'星光全彩',
				controlModelList:[{type:'Auto',title:'星光全彩'},{type:'Close',title:'红外夜观'},{type:'Intelligent',title:'双光警戒'}],
				lightSensitive:'',
				lightTime:5,
				lightTimeList:[5,10,30,60,90,120],
				constant:getApp().globalData.constant,
				isLoginSuccess:true,
				viewerNum:0,
				isFeeder:false,//是否是喂食器
				feedNumList:[1,2,3,4,5,6,7,8,9,10,11,12],
				feedNum:1,
				isShowCloudPanel:false,
				wifiUrl:'https://statics.xmcsrv.net/weixin/wifi/wifiThree4.png',
				netSpeed:''
			};
		},
		onLoad: function(options) {
			let str = decodeURIComponent(options.device)
			console.log('=== device-live:onLoad:', JSON.parse(str));
			this.device = JSON.parse(str)
			this.getCurrentDevice(options);
			this.videoContext = uni.createLivePlayerContext('livePlayer')//uni.createVideoContext('video')
			console.log('=== device-live:videoContext:', this.videoContext);
			uni.setNavigationBarTitle({
				title: this.device.deviceName
			});
			uni.setStorageSync('deviceToken',this.device.token)
			this.getNetworkStatus()
			console.log('初始化时获取缓存中的设备信息：', this.device);
			
			this.isFeeder = isFeeder().some(item => item === (this.device.pid || this.device.parentPid))

		},
		onReady: function() {
			console.log('=== device-live:onReady:');
			this.getInit();
		},
		onShow: function() {
			console.log('=== device-live:onShow:');
		},
		onHide: function() {
			console.log('--- device-live:onHide:');
			this.closeLivestream();
		},
		onUnload: function() {
			console.log('--- device-live:onUnload:');
			this.videoContext.pause();
			this.closeLivestream();
			clearInterval(this.timer);
			this.deviceLogOut()
		},
		methods: {
			
			//设备退出
			deviceLogOut(){
				let token = this.device.token
				let data = {
					Name: 'Logout',
				};
				getApp().globalData.api.deviceLogOut(data, token, (result) => {
					console.log(result,'登出')
				});
			},
			//全屏变化事件
			fullscreenchange(e){
				console.log('全屏变化事件:', e)
			},
			//播放状态变化事件
			statechange(e){
				console.log('live-player code:', e.detail.code)
				let code = e.detail.code
				if(code == 2004){
					this.isLoading = false
				}
				if(code == 2103){
					this.isLoading = true
					this.loadingText = '缓存中...'
					this.livestream()
				}
			},
			// 网络状态变化
			netstatusChange(e){
				let info = e.detail.info
				this.netSpeed = info.netSpeed != 0 ? (Number(info.netSpeed) / 8).toFixed(2) + ' KB/S' : this.netSpeed
			},
			error(e){
			    console.error('live-player error:', e.detail.errMsg)
			} ,       
			//监听网络状态
			getNetworkStatus(){
				uni.onNetworkStatusChange(function (res) {
					console.log('网络状态：',res.isConnected);
					if(!res.isConnected){
						uni.showToast({
							title:'网络无连接',
							icon:'none',
							duration:2000
						})
					}
					console.log(res.networkType);
				});

			},
			// 循环对比获取当前设备，否则使用传参设备
			getCurrentDevice(options) {
				let device = JSON.parse(decodeURIComponent(options.device));
				// let deviceList = uni.getStorageSync('deviceList') || [];
				// this.deviceList = deviceList;
				// console.log('dddddd获取缓存数据',deviceList);
				// let bool = false;

				// for (let i = 0; i < deviceList.length; i++) {
				// 	const item = deviceList[i];
				// 	console.log('有缓存');
				// 	if (item.deviceNo === device.deviceNo) {
				// 		bool = true;
				// 		this.device = item
				// 		this.deviceList = deviceList
				// 		this.isCache = true
				// 		console.log('this.deviceList',this.deviceList);
				// 		break;
				// 	}
				// }

				// if (!bool) {
				// 	console.log('没有缓存');
				// 	this.device = device
				// 	this.deviceList.push(device)
				// 	console.log(this.deviceList,'查看push')
					if (device.devPassWord) {
						this.isCache = true
					} else {
						if(uni.getStorageSync('deviceList')){
							let devList = uni.getStorageSync('deviceList')
							devList.forEach((item)=>{
								if(item.deviceNo == this.device.deviceNo){
									if(item.devPassWord && item.devUserName){
										this.device.devPassWord = item.devPassWord
										this.isCache = true
									}else{
										this.isCache = false
									}
								}
							})
						}
						// this.isCache = false
					}
				// }
			},

			/** ======================================================== 设备播放 流程 ================================================================ */
			getInit(){
				let sns = []
				sns.push(this.device.deviceNo)
				this.getDeviceToken(sns)
			},
			
			// 获取设备token
			getDeviceToken(sns) {
			    const data = {
			        sns: sns
			    };
			    getApp().globalData.api.getDeviceToken(data, (result) => {
			        console.log('获取设备token:', result);
					// 遍历缓存更新当前设备的token
			        this.deviceList.forEach((item) => {
			            result.forEach((pro) => {
			                if (item.deviceNo === pro.sn) {
			                    item.token = pro.token;
								this.device = item
			                }
			            });
			        });
					// 根据token查询当前设置状态
			        let tokenList = [];
			        result.forEach((item) => {
			            tokenList.push(item.token);
			        });
			        this.getDeviceStatus(tokenList, this.deviceList);
			    });
			},
			// 获取设备状态
			getDeviceStatus(tokenList, deviceList) {
			    const data = {
			        token: tokenList
			    };
			    getApp().globalData.api.getNewDeviceStatus(data, (result) => {
					// 遍历缓存增加或更新当前设备的status
			        deviceList.forEach((item) => {
			            result.forEach((pro) => {
			                if (item.deviceNo === pro.uuid) {
								this.$set(item,'status',pro)
								this.device = item
			                }
			            });
			        });
					// 遍历缓存更新BOSS中当前设备的token和status
					let bossDeviceList = uni.getStorageSync('bossDeviceList')
					bossDeviceList.forEach(item => {
						deviceList.forEach(pro => {
							if (item.deviceNo === pro.deviceNo) {
								item.token = pro.token
								item.status = pro.status
							}
						})
					})
					console.log(deviceList,'查看缓存之前')
					// 存储缓存
					uni.setStorageSync('deviceList',deviceList)
					uni.setStorageSync('bossDeviceList',bossDeviceList)
					this.getMore()
			    });
			},
			// 第1步 根据传参过来的设备对象以及对象状态，做一系列的判断和准备操作
			getMore() {
				let status = this.device.status; // 在线
				console.log('获取状态===',this.device.status);
				if (status.status === 'online') {
					// 低功耗设备-已休眠
					if (Number(status.wakeUpStatus) === 0) {
						console.log('ddd');
						// 支持远程唤醒
						if (status.wakeUpEnable === '1') {
							uni.showLoading({
								title: '唤醒设备中...'
							}); //唤醒设备
			
							this.wakeup(() => {
								uni.hideLoading({
									success: (res) => {
										this.loginOrAuto();
									}
								});
							});
						} 
						// 不支持远程唤醒（手动唤醒）
						else {
							console.log('dwwwwdd');
							uni.showModal({
								title: '提示',
								content: '该设备深度休眠中，需要手动唤醒！',
								showCancel: false,
								success: (res) => {
									uni.navigateBack({
										delta: 1
									});
								}
							});
						}
					} // 低功耗设备-已唤醒
					else if (status.wakeUpStatus === 1) {
						this.loginOrAuto();
						
					} // 普通设备
					else {
						this.loginOrAuto();
					}
				}
			},

			// 低功耗设备唤醒
			wakeup(callback) {
				let data={
					sn:this.device.deviceNo,
					hostedControl:"1",//是否唤醒主控（空值或0：不唤醒主控；1：唤醒主控）
				}
				getApp().globalData.api.wakeup(data,this.device.token, (result) => {
					callback();
				});
			},

			// 第2步 手动登录或自动登录
			loginOrAuto() {
				// if (!this.isCache) {
				// 	this.$refs.deviceLogin.open()
				// } else {
				// 	this.$refs.deviceLogin.submit(this.device.devUserName, this.device.devPassWord || '')
				// }
				// 直播地址
				this.livestream();
				this.$refs.deviceLogin.submit(this.device.devUserName, this.device.devPassWord || '')
			},

			// 第3步 登录
			submit(options) {
				// 缓存登录信息
				// if (!this.isCache) {
				// 	this.saveLoginInfo(options);
				// }
				this.isLogin = true
				this.saveLoginInfo(options);
				console.log('dddddddddddd---',uni.getStorageSync('deviceList'));
				// if(!this.isLoginSuccess){
				// 	// 直播地址
				// 	this.livestream();
				// }
				this.livestream();
				// 云服务
				this.reqCaps();
				// 设备基础信息
				const data = { Name: 'SystemInfo' };
				this.getinfo(data);
				// 保活
				this.initKeepAlive();
			},

			// 缓存登录信息
			saveLoginInfo(options) {
				console.log(options,'设置缓存')
				let deviceList = uni.getStorageSync('deviceList') || [];
				this.device.devUserName = options.username;
				this.device.devPassWord = options.password;
				let isCache = false
				deviceList.forEach((item)=>{
					if(this.device.deviceNo == item.deviceNo){
						item.devUserName = options.username
						item.devPassWord = options.password
						isCache = true
					}
				})
				if(!isCache){
					deviceList.push(this.device);
				}
				uni.setStorageSync('deviceList', deviceList);
				console.log('更新缓存',uni.getStorageSync('deviceList'));
			},

			// 第4步-1 保活
			// 20秒执行一次，当连续请求两次保活失败时，则不再保活
			initKeepAlive() {
				console.log('定时器：', this.timer);

				if (this.timer !== null) {
					clearInterval(this.timer);
					this.timer = null
				}

				this.timer = setInterval(() => {
					this.keepAlive();
				}, 20000)
			},

			// 保活
			keepAlive() {
				let token = this.device.token;
				getApp().globalData.api.keepAlive(token, (result) => {
					// console.log('保活：', result);

					if (result.data.code === 2000) {
						if (result.data.data.Ret === 100) {
							// 不需要操作
						} else {
							if (this.keepAliveCount === 0) {
								this.keepAliveCount = this.keepAliveCount + 1
								this.initKeepAlive();
							} else {
								clearInterval(this.timer);
							}
						}
					} else {
						if (this.keepAliveCount === 0) {
							this.keepAliveCount = this.keepAliveCount + 1
							this.initKeepAlive();
						} else {
							clearInterval(this.timer);
						}
					}
				});
			},

			// 第4步-2 获取设备直播地址
			livestream() {
				let token = this.device.token;
				let data = {
					// videoCode:'h264',
					mediaType: 'rtmp',//'hls'
					channel: '0',
					stream: this.stream,
					protocol: 'ts',
					username: this.device.devUserName,
					devPwd: this.device.devPassWord || '',
					userToken: uni.getStorageSync('accessToken'),
					appKey:getApp().globalData.api.appKey,
					encryptType: 'DISABLE',
					// forceIp:'119.3.85.251'
				};
				if(this.device.adminToken){
					data.authentication = this.device.adminToken
					data.encryptType = 'TOKEN'
				}
				getApp().globalData.api.livestream(data, token, (result) => {
					console.log('获取设备直播地址:', result); // 渲染层网络层错误
					if(result.data&&result.data.code == 2000){
						
					}else{
						
					}

					if (result && (result.Ret === 100 || result.Ret === 104)) {
						// let url = result.url;
						// this.keepRequestUntillRight(url);
						this.url = result.url
						this.getStreamConnectionsNum()
					} // 设备登录错误情况
					else if (result && (result.Ret === 105 || result.Ret === 106 || result.Ret === 202 || result.Ret === 203)) {
					    wx.showModal({
					        title: '提示',
					        content: getApp().globalData.errCodeMsg.RetCodeMsg[result.Ret]||result.retMsg,
					        success: (response) => {
					            if (response.confirm) {
					                // 用户点击确定 去登录
					                // this.isShowLogin = true
									this.isLoginSuccess = false
									this.$refs.deviceLogin.open()
					            } else if (response.cancel) {
					                // 用户点击取消
					                wx.navigateBack({
					                    delta: 1,
					                })
					            }
					        }
					    })
						// this.loginOrAuto()
					}
					// 其他错误情况
					else {
						uni.showToast({
							title:getApp().globalData.errCodeMsg.RetCodeMsg[result.Ret]||result.RetMsg,
							icon:'none'
						})
						// uni.showModal({
						// 	title: '提示',
						// 	content: getApp().globalData.errCodeMsg.RetCodeMsg[result.Ret]||result.RetMsg,
						// 	showCancel: false
						// });
					}
				});
			},
			//获取预览视频的观看人数
			getStreamConnectionsNum(){
				let token = this.device.token
				let str = this.url.split(':')[1]
				let data = {
					liveAddress: str.split('//')[1],
				};
				getApp().globalData.api.getStreamConnectionsNum(data,token,(result)=>{
					this.viewerNum = result.num
					console.log('观看人数：',result);
				})
			},

			// 停止设备码流
			closeLivestream(callback) {
				const token = this.device.token;
				const data = {
					channel: '0',
					stream: this.stream,
					PassWord:this.device.devPassWord,
					UserName:this.device.devUserName,
					EncryptType:'DISABLE',
					authentication:this.device.adminToken || ''
				};
				getApp().globalData.api.closeLivestream(data, token, (result) => {
					console.log('停止设备码流:', result);

					if (typeof callback === 'function') {
						callback();
					}
				});
			},

			// 一直请求直到请求成功（处理：渲染层网络层错误）
			keepRequestUntillRight(url) {
				console.log('=====一直请求直到请求成功=======');
				uni.request({
					method: 'GET',
					url,
					success: (res) => {
						if (res.statusCode == 200) {
							this.url = url
							this.isLoading = false
						} else if (res.statusCode == 400) {
							uni.showModal({
								title: '提示',
								content: res.data,
								showCancel: false
							});
						} else {
							setTimeout(() => {
								this.keepRequestUntillRight(url);
							}, 1000);
						}
					},
					fail: (err) => {
						console.log('error:', err);
					}
				});
			},

			// 第4步-3 能力集(判断设备是否具备操控能力)
			// 第4步-3-1 获取设备基础信息
			getinfo(data) {
				uni.showLoading({
					title: '获取设备基础信息...'
				});
				let token = this.device.token;
				getApp().globalData.api.getinfo(data, token, (result) => {
					uni.hideLoading()
					console.log('获取设备基础信息:', result);
					if(result.Name == 'SystemInfo'){
						this.isSupportOld = this.isSupportPTZDevice(result.SystemInfo)
						console.log('isSupportOld',this.isSupportOld);
						let param1 = { Name: 'SystemFunction' };
						this.getability(param1);
						let constant = getApp().globalData.constant;
						if(this.device.parentPid == constant.DEVICE_TYPE.EE_DEV_BOUTIQUEROBOT){
							let param2 = { Name: 'GoToPosition' };
							this.getability(param2);
						}
						
					}
					if(result.Name == ' '){
						
					}
				});
			},

			// 判断是否摇头机：1.根据硬件版本判断当前操作设备是否是摇头机
			isSupportPTZDevice(systemInfo) {
				let hardware = '';
				let flag = false;

				try {
					if (systemInfo != null) {
						hardware = systemInfo.HardWare;
					}

					let hardwareArray = hardware.split('_'); // XM530_RD50X40_8M => ["XM530","RD50X40","8M"]

					for (let i = 0; i < hardwareArray.length; i++) {
						if (hardwareArray[i] != null && hardwareArray[i].length >= 2) {
							let tmpStr = hardwareArray[i].trim();

							if (tmpStr.startsWith('R') || tmpStr.startsWith('N')) {
								flag = true;
							}
						}
					}
				} catch (err) {
					console.log(err);
				}

				return flag;
			},

			// 第4步-3-2 获取设备能力集
			// 判断是否摇头机：2.支持云台功能（新的设备才会有 2019-11-08 新加）
			getability(data) {
				uni.showLoading({
					title: '获取设备能力集...'
				});
				let token = this.device.token;
				getApp().globalData.api.getability(data, token, (result) => {
					console.log('获取设备能力集:', result);
					uni.hideLoading({
						success: (res) => {
							if(result.Name = 'SystemFunction'){
								let flag = result.SystemFunction&&result.SystemFunction.OtherFunction&&result.SystemFunction.OtherFunction.SupportPTZDirectionControl;
								this.isSupportNew = flag
								this.isWifiSignal = result.SystemFunction&&result.SystemFunction.NetServerFunction.WifiRouteSignalLevel
								let data = { Name: 'Detect.HumanDetection' }; //人形检测
								if(result.SystemFunction&&result.SystemFunction.AlarmFunction&&result.SystemFunction.AlarmFunction.HumanDection){
									this.getConfig(data)
								}
								if(this.isSupportNew || this.isSupportOld){
									let data2 = { Name: 'Detect.DetectTrack' }; //移动追踪开关
									// this.getConfig(data2)
									this.isShowLightWarn = true
								}
								if(this.isWifiSignal){
									let constant = getApp().globalData.constant;
									if(this.device.parentPid == constant.DEVICE_TYPE.EE_DEV_BOUTIQUEROBOT){
										let param = { Name: 'WifiRouteInfo' };
										this.getinfo(param)
									}
								}
							}
							if(result.Name = 'GoToPosition'){
								if(result.Ret ==100){
									this.isSnapshot = true
								}else this.isSnapshot = false
								
							}
						}
					});
				});
			},

			// 第4步-3-3 云服务
			reqCaps() {
				const data = {
					sn: this.device.deviceNo,
					caps: ['xmc.css']
				};
				getApp().globalData.api.reqCaps(data, (result) => {
					console.log('云服务:', result);
					let time = Math.floor(new Date().getTime() / 1000);
					let caps = result.caps;
					let text = '';
					let flag = false;

					if (!caps['xmc.css.vid.support']) {
						// 不支持的情况下不要显示出来
						text = '不支持';
						flag = false;
					} else if (!caps['xmc.css.vid.enable']) {
						text = '未开通';
						flag = true;
					} else if (caps['xmc.css.vid.expirationtime'] < time) {
						text = '已过期';
						flag = true;
					} else {
						text = '';
						flag = true;
					}

					this.isCloud = flag
					this.cloudText = text
				});
			},

			/** ======================================================== video回调 ================================================================== */
			// 显示隐藏控条bar
			bindtap() {
				this.isShowBar = !this.isShowBar
			},

			// 当开始/继续播放时触发play事件
			bindplay(ev) {
				console.log('当开始/继续播放时触发play事件:', ev);
			},

			// 当暂停播放时触发 pause 事件
			bindpause(ev) {
				console.log('当暂停播放时触发 pause 事件:', ev);
			},

			// 当播放到末尾时触发 ended 事件
			bindended(ev) {
				console.log('当暂停播放时触发 pause 事件:', ev);
			},

			// 播放进度变化时触发
			bindtimeupdate(ev) {
				// console.log('播放进度变化时触发:',ev);
				if (this.isLoading) {
					this.isLoading = false
				}
			},

			// 视频进入和退出全屏时触发
			bindfullscreenchange(ev) {
				console.log('视频进入和退出全屏时触发:', ev);
			},

			// 视频出现缓冲时触发
			bindwaiting(ev) {
				console.log('视频出现缓冲时触发:', ev);
				this.isLoading = true
				this.loadingText = '缓冲中...'
			},

			// 视频播放出错时触发
			binderror(ev) {
				console.log('视频播放出错时触发:', ev);
				uni.showModal({
					title: '提示',
					content: '媒体链接已断开,请重试',
					showCancel: false,
					success: (res) => {
						if (res.confirm) {
							let tokenList = [this.device.token];
							this.getDeviceStatus(tokenList,this.deviceList)
						}
					}
					
				});
			},

			// 加载进度变化时触发，只支持一段加载
			bindprogress(ev) {
				console.log('加载进度变化时触发，只支持一段加载:', ev);
			},

			// 视频元数据加载完成时触发
			bindloadedmetadata(ev) {
				console.log('视频元数据加载完成时触发:', ev);
			},

			// 切换 controls 显示隐藏时触发
			bindcontrolstoggle(ev) {
				console.log('切换 controls 显示隐藏时触发:', ev);
			},

			// 播放器进入小窗
			bindenterpictureinpicture(ev) {
				console.log('播放器进入小窗:', ev);
			},

			// 播放器进入小窗
			bindleavepictureinpicture(ev) {
				console.log('播放器退出小窗:', ev);
			},

			// seek 完成时触发
			bindseekcomplete(ev) {
				console.log('seek 完成时触发:', ev);
			},

			/** ================================================== 标高清切换 & 截图 =================================================================== */
			// 分享
			onBindShare(){
				let famliy = uni.getStorageSync('')
				uni.showModal({
					title:'提示',
					confirmText:'邀请',
					confirmColor:'#1AC0BA',
					content:`需要将您的家人邀请至该家庭组下才能分享该设备。`,
					success: (res) => {
						if(res.confirm){
							this.onBindtapAddUser()
						}
					}
				})
			},
			//邀请
			onBindtapAddUser() {
			  const data = {
			    userGroupId: uni.getStorageSync('currentGroupId')
			  }
			  getApp().globalData.api.getKey(data, result => {
			    console.log(result);
			    wx.showModal({
			      title: '邀请码',
			      content: result,
			      confirmText: '复制',
			      showCancel: false,
			      success(res) {
			        if (res.confirm) {
			          console.log('用户点击确定')
			          wx.setClipboardData({
			            data: result,
			            success(res) {
			              console.log(res);
			            }
			          })
			        }
			      }
			    })
			  })
			},
			// 标清高清切换
			onBindtapSDFHD() {
				if (this.stream === '0') {
					this.isLoading = true
					this.loadingText = '切换为标清...'
					this.url = ''
					this.streamText = '标清'
					this.streamTextIcon = 'SD'
				} else {
					this.isLoading = true
					this.loadingText = '切换为高清...'
					this.url = ''
					this.streamText = '高清'
					this.streamTextIcon = 'FHD'
				}

				this.closeLivestream(() => {
					if (this.stream === '0') {
						this.stream = '1'
					} else {
						this.stream = '0'
					}

					setTimeout(() => {
						this.livestream();
					}, 3000);
				});
			},
			//是否显示云服务
			onShowCloud(){
				this.isShowCloudPanel = !this.isShowCloudPanel
			},
			// 静音开关按钮
			onBindtapMuted(){
				this.isMute = !this.isMute
				console.log('ddddd静音',this.isMute);
				if(this.isMute){
					this.mutedIcon = 'https://statics.xmcsrv.net/weixin/toolIcon0.png'
				}else{
					this.mutedIcon = 'https://statics.xmcsrv.net/weixin/toolIcon0-1.png'
				}
			},

			// 截图
			onBindtapCapture() {
				uni.showLoading();
				uni.getSetting({
					success: (response) => {
						if (response.authSetting['scope.writePhotosAlbum']) {
							const token = this.device.token;
							const data = {
								Name: 'OPSNAP',
								OPSNAP: {
									Channel: 0,
									picType: 1
								}
							};
							getApp().globalData.api.capture(data, token, (result) => {
								uni.hideLoading({
									success: () => {
										if (result.Ret === 100) {
											this.captureUrl = result.image
											this.isCapture = true

											// 获取图片信息
											uni.getImageInfo({
												src: result.image,
												success: (res) => {
													uni.saveImageToPhotosAlbum({
														filePath: res
															.path,
														success: () => {
															uni.showToast({
																title: '已保存到相册中',
																icon: 'success',
																success: () => {
																	setTimeout
																		(() => {
																				this.isCapture =
																					false
																			},
																			1500
																		);
																}
															});
														}
													});
												}
											});
										}
									}
								});
							});
						} else {
							uni.hideLoading();
							uni.showModal({
								title: '提示',
								content: '相册未授权',
								success: (res) => {
									if (res.confirm) {
										uni.authorize({
											scope: 'scope.writePhotosAlbum',
											success: () => {
												console.log('授权成功');
											}
										});
									}
								}
							});
						}
					}
				});
			},

			/**===================================================== 摇头 ============================================================================= */
			// 步长
			bindchangeStep(ev) {
				this.step = ev.detail.value
			},

			// 控制摇头
			onBindtapControl() {
				if (this.isSupportOld || this.isSupportNew) {
					this.$refs.popupControl.open()
				} else {
					uni.showModal({
						title: '提示',
						content: '该设备不具备此能力集'
					});
				}
			},

			// 遥控-开始运动
			onBindtouchstart(ev) {
				let type = ev
				let Command = '';
                let upUpside =  uni.getStorageSync('turn_video_up')?uni.getStorageSync('turn_video_up').status:false;
				let leftUpside = uni.getStorageSync('turn_video_left')?uni.getStorageSync('turn_video_left').status:false;
				console.log(upUpside,'上下状态')
				console.log(leftUpside,'左右状态')
				switch (type) {
					case 'up':
						Command = upUpside?'DirectionDown': 'DirectionUp';
						break;

					case 'rightup':
						Command = 'DirectionRightUp';
						break;

					case 'right':
						Command =  leftUpside?'DirectionLeft':'DirectionRight';
						break;

					case 'rightdown':
						Command = 'DirectionRightDown';
						break;

					case 'bottom':
						Command = upUpside?'DirectionUp':'DirectionDown';
						break;

					case 'leftdown':
						Command = 'DirectionLeftDown';
						break;

					case 'left':
						Command = leftUpside?'DirectionRight':'DirectionLeft';
						break;

					case 'leftup':
						Command = 'DirectionLeftUp';
						break;
				}
				this.type = type
				const token = this.device.token;
				const data = {
					Name: 'OPPTZControl',
					OPPTZControl: {
						Command: Command,
						Parameter: {
							Preset: 0,
							Channel: 0,
							Step: this.stepList[this.step]
						}
					}
				};
				getApp().globalData.api.opdev(data, token, (result) => {
					console.log('up-move:', result);
				});
			},

			// 遥控-停止运动
			onBindtouchend(ev) {
				let type = ev
				let Command = '';
                let upUpside =  uni.getStorageSync('turn_video_up')?uni.getStorageSync('turn_video_up').status:false;
				let leftUpside = uni.getStorageSync('turn_video_left')?uni.getStorageSync('turn_video_left').status:false;
				console.log(upUpside,'上下状态')
				console.log(leftUpside,'左右状态')
				switch (type) {
					case 'up':
						Command =  'DirectionUp';
						break;

					case 'rightup':
						Command = 'DirectionRightUp';
						break;

					case 'right':
						Command =  'DirectionRight';
						break;

					case 'rightdown':
						Command = 'DirectionRightDown';
						break;

					case 'bottom':
						Command = 'DirectionDown';
						break;

					case 'leftdown':
						Command = 'DirectionLeftDown';
						break;

					case 'left':
						Command = 'DirectionLeft';
						break;

					case 'leftup':
						Command = 'DirectionLeftUp';
						break;
				}

				this.type = ''
				const token = this.device.token;
				const data = {
					Name: 'OPPTZControl',
					OPPTZControl: {
						Command: Command,
						Parameter: {
							Preset: -1,
							Channel: 0,
							Step: this.stepList[this.step]
						}
					}
				};
				getApp().globalData.api.opdev(data, token, (result) => {
					console.log('up-stop:', result);
				});
			},

			/**===================================================== 预置点 ============================================================================= */
			// 显示隐藏预置点
			bindtapPreset() {
				this.$refs.popupPreset.open()
				this.valuePreset = ''
				this.getPresetList();
			},
			
			// 获取配置
			getConfig(data){
				let token = this.device.token;
				getApp().globalData.api.getconfig(data, token, (result) => {
					console.log('=====================获取巡航预置点:', result);
					if(result.Name == 'Uart.PTZPreset'){
						this.presetData = result['Uart.PTZPreset']
					}
					if(result.Name == 'Detect.HumanDetection'){
						this.humanDetectionQuery = result
					}
					if(result.Name == 'Detect.DetectTrack'){
						this.trackQuery = result
						let query = result['Detect.DetectTrack']
						this.isTrackSwitch = query.Enable
						console.log('dddd开关',this.isTrackSwitch,query.Enable);
						
						this.watchTimeList.forEach((item)=>{
							if(item.sec == query.ReturnTime){
								this.watchTime = item.title
							}
						})
						this.senstiveList.forEach((item)=>{
							if(item.id == query.Sensitivity){
								this.sensitivity = item.title
							}
						})
						
					}
					if(result.Name == 'Camera.WhiteLight'){
						this.lightQuery = result
						let query = result['Camera.WhiteLight']
						
						this.lightTime = query.MoveTrigLight.Duration
						this.controlModelList.forEach((item)=>{
							if(item.type == query.WorkMode){
								this.controlModel = item.title
							}
						})
						this.lightSenstiveList.forEach((item)=>{
							if(item.id == query.MoveTrigLight.Level){
								this.lightSensitive = item.title
							}
						})
					}
					
				});
			},
			// 设置配置
			setConfig(data){
				let token = this.device.token;
				getApp().globalData.api.setconfig(data, token, (result) => {
					console.log('=====================设置配置:', result);
				});
			},
			// 获取预置点
			getPresetList() {
				let data = { Name: 'Uart.PTZPreset' };
				this.getConfig(data)
			},

			// 输入预置点
			bindinput(ev) {
				// console.log(ev,this.valuePreset);
				let value = ev.detail.value;
				value = value.replace(/\D*/g, '');
				value = value.replace(/^0/, '');
				value = value.substring(0, 3);

				if (Number(value) > 255) {
					value = 255;
				} else {
					value = value;
				}

				if (value.length > 0) {
					this.valuePreset = value
					this.disabled = false
				} else {
					this.valuePreset = value
					this.disabled = true
				}
			},

			// 设置预置点
			bindtapSet(ev) {
				uni.showLoading();
				let token = this.device.token;
				let data = {
					Name: 'OPPTZControl',
					OPPTZControl: {
						Command: 'SetPreset',
						Parameter: {
							Preset: Number(this.valuePreset),
							Channel: 0,
							PresetName: '预置点' + this.valuePreset
						}
					}
				};
				getApp().globalData.api.opdev(data, token, (result) => {
					console.log('设置预置点：',result);
					this.valuePreset = ''
					this.disabled = true
					this.getPresetList();
					uni.showToast({
						title:'设置守望成功',
						icon:'none',
						duration:2000
					})
				});
			},
			handleDemo(val) {
				console.log('===>', val);
			},
			// 调用预置点
			bindtapCall(ev) {
				console.log('===>', ev);
				uni.showLoading();
				let pro = ev.currentTarget.dataset.pro
				let token = this.device.token;
				let data = {
					Name: 'OPPTZControl',
					OPPTZControl: {
						Command: 'GotoPreset',
						Parameter: {
							Preset: Number(pro.Id),
							Channel: 0,
							PresetName: pro.PresetName
						}
					}
				};
				getApp().globalData.api.opdev(data, token, (result) => {
					console.log('转到预置点：', result);
					uni.hideLoading({
						success: (res) => {}
					});
				});
			},

			// 删除预置点
			bindtapDel(ev) {
				console.log(ev);
				uni.showLoading();
				let pro = ev.currentTarget.dataset.pro
				let token = this.device.token;
				let data = {
					Name: 'OPPTZControl',
					OPPTZControl: {
						Command: 'ClearPreset',
						Parameter: {
							Preset: Number(pro.Id),
							Channel: 0,
							PresetName: pro.PresetName
						}
					}
				};
				getApp().globalData.api.opdev(data, token, (result) => {
					console.log('转到预置点：', result);
					uni.showToast({
						title: '删除成功',
						icon:'none',
						success: (res) => {
							this.getPresetList();
						}
					});
				});
			},

			/**===================================================== 云台校正 ============================================================================= */
			// 云台校正
			// bindtapPositionReset() {
			// 	uni.showLoading();
			// 	let token = this.device.token;
			// 	let data = {
			// 		Name: 'OPPTZControl',
			// 		OPPTZControl: {
			// 			Command: 'PositionReset'
			// 		}
			// 	};
			// 	getApp().globalData.api.opdev(data, token, (result) => {
			// 		console.log('校正：', result);
			// 		uni.hideLoading({
			// 			success: (res) => {}
			// 		});
			// 	});
			// },
			/**===================================================== 灯光警戒 ============================================================================= */
			//控制模式
			bindControlPickerChange(e){
				this.controlModel = this.controlModelList[e.detail.value].title
				this.lightQuery['Camera.WhiteLight'].WorkMode = this.controlModelList[e.detail.value].type
				this.setConfig(this.lightQuery)
			},
			//灯光警戒灵敏度
			bindSensitivePickerChange(e){
				this.lightSensitive = this.lightSenstiveList[e.detail.value].title
				this.lightQuery['Camera.WhiteLight'].MoveTrigLight.Level = this.lightSenstiveList[e.detail.value].id
				this.setConfig(this.lightQuery)
			},
			//持续亮灯时间
			bindLightPickerChange(e){
				this.lightTime = this.lightTimeList[e.detail.value]
				this.lightQuery['Camera.WhiteLight'].MoveTrigLight.Duration = this.lightTime
				this.setConfig(this.lightQuery)
			},
			closeLightWarn(){
				this.$refs.lightWarn.close()
			},
			/**===================================================== 移动追踪 ============================================================================= */
			// 显示移动追踪弹框
			bindtapMobileTracking(){
				let data = {Name:'Detect.DetectTrack'}
				this.getConfig(data)
				let data2 = { Name: 'Detect.HumanDetection' }; //人形检测
				this.getConfig(data2)
				this.$refs.popupTrack.open()
			},
			// 开启移动追踪开关
			trackSwitchChange(e){
				console.log('eeeee',e);
				this.trackQuery['Detect.DetectTrack'].Enable = e
				if(e && this.humanDetectionQuery['Detect.HumanDetection'][0].Enable){
					uni.showModal({
						content:'人形检测和移动追踪不能同时打开，如果开启移动追踪，人形检测将会被关闭,确认操作？',
						success: (res) => {
							if(res.confirm){
								this.humanDetectionQuery['Detect.HumanDetection'][0].Enable = false
								this.isTrackSwitch = true 
								this.setConfig(this.humanDetectionQuery)
								this.setConfig(this.trackQuery)
							}else{
								this.isTrackSwitch = false
							}
						}
					})
				}else{
					this.setConfig(this.trackQuery)
				}
				
				
			},
			//设为守望位置
			setWatchPosition(){
				this.bindtapSet()
			},
			//选择灵敏度
			chooseSensitive(item){
				this.sensitivity = item.title
				this.isShowSensitive = false
				this.trackQuery['Detect.DetectTrack'].Sensitivity = item.id
				this.setConfig(this.trackQuery)
			},
			//选择守望时间
			chooseWatchTime(item){
				this.watchTime = item.title
				this.isShowWatchTime = false
				this.trackQuery['Detect.DetectTrack'].ReturnTime = item.sec
				this.setConfig(this.trackQuery)
			},
			//显示灵敏度选择框
			onShowSensitive(){
				this.isShowSensitive = !this.isShowSensitive
			},
			//显示守望时间选择框
			onShowWatchTime(){
				this.isShowWatchTime = !this.isShowWatchTime
			},
			// 关闭移动追踪弹框
			closeTrackPopup(){
				this.$refs.popupTrack.close()
			},

			/**===================================================== 点间巡航 ============================================================================= */
			// 显示隐藏定位巡航
			bindtapCruise() {
				this.$refs.popupCruise.open()
				// this.getPreset();
			},

			// 定位巡航-预置点
			bindchangePreset(ev) {
				this.preset = ev.detail.value
			},

			// 定位巡航-时间间隔
			bindinputTime(ev) {
				let value = ev.detail.value;
				value = Number(value) >= 120 ? 120 : Number(value)
				value = Number(value) <= 3 ? 3 : Number(value)
				this.time = value
			},

			// 获取巡航预置点
			getPreset() {
				let token = this.device.token;
				let data = {
					Name: 'Uart.PTZTour'
				};
				getApp().globalData.api.getconfig(data, token, (result) => {
					console.log('=====================获取巡航预置点:', result);
					this.tourData = []
					if (result['Uart.PTZTour'] && result['Uart.PTZTour'].length > 0 && result['Uart.PTZTour'][0].length >= 2) {
						this.tourData = result['Uart.PTZTour'][0][1]
					}
				});
			},

			// 设置巡航预置点 - 接口
			bindtapAddPreset() {
				uni.showLoading();
				let token = this.device.token;
				let data = {
					Name: 'OPPTZControl',
					OPPTZControl: {
						Command: 'AddTour',
						Parameter: {
							Tour: 1,
							Preset: Number(this.presetList[this.preset]),
							PresetIndex: Number(this.presetList[this.preset]),
							Step: Number(this.time)
						}
					}
				};
				getApp().globalData.api.opdev(data, token, (result) => {
					uni.hideLoading({
						success: (res) => {
							console.log('====================', result);
							this.getPreset();
						}
					});
				});
			},

			// 显示删除巡航预置点弹出窗口
			showDelPreset() {
				this.$refs.popup.open()
				this.getPreset();
			},

			// 删除巡航预置点
			bindtapDelPreset(ev) {
				uni.showLoading();
				let item = ev.currentTarget.dataset.item
				let token = this.device.token;
				let data = {
					Name: 'OPPTZControl',
					OPPTZControl: {
						Command: 'DeleteTour',
						Parameter: {
							Tour: 1,
							Preset:  item.Id //Number(this.presetList[this.preset])
						}
					}
				};
				getApp().globalData.api.opdev(data, token, (result) => {
					uni.hideLoading({
						success: (res) => {
							console.log('====================', result);
							this.getPreset();
						}
					});
				});
			},

			// 删除巡航线路
			bindtapClearCruise() {
				uni.showModal({
					title:'提示',
					content:'确认清除巡航线路？',
					success: (res) => {
						if(res.confirm){
							uni.showLoading();
							let token = this.device.token;
							let data = {
								Name: 'OPPTZControl',
								OPPTZControl: {
									Command: 'ClearTour',
									Parameter: {
										Tour: 1
									}
								}
							};
							getApp().globalData.api.opdev(data, token, (result) => {
								uni.hideLoading({
									success: (res) => {
										console.log('====================', result);
										this.getPreset();
									}
								});
							});
						}
					}
				})
			},

			// 执行巡航
			bindtapStartCruise(ev) {
				uni.showLoading();
				this.disabled2 = true
				let token = this.device.token;
				let data = {
					Name: 'OPPTZControl',
					OPPTZControl: {
						Command: 'StartTour',
						Parameter: {
							Tour: 1,
							TourTimes: 1
						}
					}
				};
				getApp().globalData.api.opdev(data, token, (result) => {
					uni.showToast({
						title:'成功开始巡航',
						icon:'none'
					})
					this.disabled2 = false
					this.getPreset();
				});
			},

			// 结束巡航
			bindtapStopCruise(ev) {
				uni.showLoading();
				this.disabled3 = true
				let token = this.device.token;
				let data = {
					Name: 'OPPTZControl',
					OPPTZControl: {
						Command: 'StopTour'
					}
				};
				getApp().globalData.api.opdev(data, token, (result) => {
					uni.showToast({
						title:'成功结束巡航',
						icon:'none'
					})
					this.disabled3 = false
					this.getPreset();
				});
			},

			/**===================================================== 其他 ============================================================================= */
			//auto切换
			onAutoAction(){
				console.log('切换类型');
				if(this.fitType == 'contain'){
					this.fitType = 'fillCrop'
				}else if(this.fitType == 'fillCrop') {
					this.fitType = 'contain'
				}
			},
			// 生成全景图
			onBindtapOverallView(){
				uni.navigateTo({
					url: `/jvss/pagesDevice/device/device-live/wholeScene/wholeScene?device=${encodeURIComponent(JSON.stringify(this.device))}`
				})
			},
			// 全屏
			onBindtapFullScreen(ev) {
				console.log('全屏：', ev);
				// this.videoContext.requestFullScreen();
				// this.isFullScreen = true
				console.log('全屏---------',this.videoContext);
				this.isFullScreen = !this.isFullScreen
				if(this.isFullScreen){
					this.videoContext.requestFullScreen({
					    direction: 90,
					    success:(e)=> {
							console.log('全屏success---------');
					        this.isFullScreen = true
							this.isShowBar = true
					    },
						complete:(e)=>{
							console.log('全屏-complete--------');
						}
					})
				}else{
					this.onBindtapExitFullScreen()
				}
			},

			// 取消全屏
			onBindtapExitFullScreen(ev) {
				console.log('取消全屏：');
				// this.videoContext.exitFullScreen();
				// this.isFullScreen = false
				this.videoContext.exitFullScreen({
				    success:(e)=> {
						console.log('取消全屏---------');
				        this.isFullScreen = false
				    },
				})
			},
			//选择喂食份数
			choosefeedNum(item){
				this.feedNum = item
			},
			//宠物一键喂食
			oneClickFeeding(){
				uni.showLoading({ 
					title:'正在一键喂食'
				})
				let token = this.device.token
				let data = {
					sn: this.device.deviceNo,
					props: {
					    feed: this.feedNum
					}
				}
				getApp().globalData.api.oneClickFeeding(data,token, result => {
					console.log('一键喂食结果',result);
					uni.hideLoading()
					if(result.Ret == 100){
						uni.showToast({
							title:'一键喂食成功',
							icon:'none'
						})
					}else{
						uni.showToast({
							title:getApp().globalData.errCodeMsg.RetCodeMsg[result.Ret]||result.RetMsg,
							icon:'none'
						})
					}
				})
			},

			// 云服务
			onBindtapCloud() {
				uni.navigateTo({
					url: `/jvss/pagesDevice/device/device-live/door-lock/msgDetail?device=${encodeURIComponent(JSON.stringify(this.device))}`
				});
			},
			
			// 云回放
			onBindtapReplay(){
				uni.navigateTo({
					url: `/jvss/pagesDevice/device/device-live/replay/replay?device=${encodeURIComponent(JSON.stringify(this.device))}`
				});
			},
			//设置灯光警戒
			onBindLightWarning(){
				let data = {Name:'Camera.WhiteLight'}
				this.getConfig(data)
				this.$refs.lightWarn.open()
			},

			// 设置
			onBindtapSetting() {
				// this.closeLivestream()
				// return
				this.device.isSupportPTZDevice = this.isSupportNew || this.isSupportOld?true:false
				uni.navigateTo({
					url: `/jvss/pagesDevice/device/device-live/setting/setting?device=${encodeURIComponent(JSON.stringify(this.device))}`
				});
			}
		}
	};
</script>
<style lang="scss" scoped>
	page {
		overflow: hidden;
	}
	.noFull{
		width: 100%;
		height: 225px;
	}
	.isFull{
		 width: 100vw;
		 height: 100vh;
	}
	.livePlay{
		width: 100%;
		object-fit: fill;
		height: 100%;
		display: block; 
	}

	.video-control {
		width: 100%;
		height: 100rpx;
		line-height: 100rpx;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 99;
	}

	.loading-box {
		width: 100%;
		height: 100%;
		position: absolute;
		left: 0;
		top: 0;
		z-index: 99;
		color: #ffffff;
		display: flex;
		justify-content: center;
		align-items: center;
		
	}

	.loading {
		width: 100%;
		height: 72rpx;
		line-height: 72rpx;
		text-align: center;
		color: #ffffff;
	}
	.rightV{
		// width: 280rpx;
		// height: 100%;
		padding:5rpx 20rpx;
		position: absolute;
		right: 10rpx;
		top: 15rpx;
		z-index: 999;
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: row;
		.right{
			display: flex;
			justify-content: center;
			align-items: center;
			flex-direction: row;
			border-radius: 5rpx;
			padding:10rpx 20rpx;
			background: rgba(0, 0, 0, 0.5);
			.auto{
				border-radius: 5rpx;
				border: 1px solid #fff;
				padding: 5rpx 2rpx;
				font-size: 18rpx;
				// width: 70rpx;
				// line-height: 36rpx;
				// height: 36rpx;
				text-align: center;
				color: #FFFFFF;
			}
			.autoActive{
				color:#FF0025;
				border: 1px solid #FF0025;
			}
		}
		.img{
			width: 33rpx;
			height: 33rpx;
			margin-left: 20rpx;
			// margin:0 20rpx;
		}
	}
	
	.scene{
		width: 60rpx;
		height: 60rpx;
		position: absolute;
		left: 80rpx;
		bottom: 20rpx;
		z-index: 99;
		background: red;
		// img{
		// 	width: 40rpx;
		// 	height: 40rpx;
		// 	margin-left: 20rpx;
		// }
	}

	.topbar {
		width: 100%;
		position: absolute;
		left: 0;
		top: 100rpx;
		z-index: 100;
		color: #ffffff;
		/* background: linear-gradient(rgba(0,0,0,1), rgba(0,0,0,0)); */
		// background: rgba(0, 0, 0, 0.5);
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	/* .bottombar {
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 7rpx;
    z-index: 100;
    color: #FFFFFF;
    background: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,1));
    background: rgba(0,0,0,0.5);
    display: flex;
    justify-content: flex-end;
    align-items: center;
} */

	.icon {
		width: 72rpx;
		height: 72rpx;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.img {
		display: block;
		width: 36rpx;
		height: 36rpx;
	}

	.capture {
		position: absolute;
		top: 30rpx;
		left: 0;
		right: 0;
		z-index: 999;
		width: 80%;
		height: auto;
		border: 1px solid red;
		box-shadow: 0rpx 10rpx 30rpx rgba(0, 0, 0, 0.75);
		margin: auto;
	}

	.jf-button {
		background: transparent;
		width: auto;
		margin: 0;
		line-height: 1.25;
	}

	.jf-button::after {
		border: none;
	}
	.cellIcon{
		margin-left: 20rpx;
		image{
			width: 50rpx;
			height: 50rpx;
		}
	}

	.video-control-extra {
		height: 10vh;
		display: flex;
		justify-content: space-between;
		align-items: center;
		background: #ffffff;
	}

	.control-inner {
		position: relative;
		display: flex;
		justify-content: center;
		align-items: center;
		width: 35vw;
		height: 35vw;
		border-radius: 100%;
		border: 1px solid #cccccc;
	}

	.control-handle {
		display: block;
		width: 48rpx;
		height: 48rpx;
		position: absolute;
	}

	.control-top {
		top: 0;
	}

	.control-top-right {
		top: 30rpx;
		right: 30rpx;
		transform: rotate(45deg);
	}

	.control-right {
		right: 0;
		transform: rotate(90deg);
	}

	.control-right-bottom {
		right: 30rpx;
		bottom: 30rpx;
		transform: rotate(135deg);
	}

	.control-bottom {
		bottom: 0;
		transform: rotate(180deg);
	}

	.control-bottom-left {
		bottom: 30rpx;
		left: 30rpx;
		transform: rotate(225deg);
	}

	.control-left {
		left: 0;
		transform: rotate(270deg);
	}

	.control-left-top {
		left: 30rpx;
		top: 30rpx;
		transform: rotate(315deg);
	}

	.control-center {
		width: 12vw;
		height: 12vw;
		border-radius: 100%;
		background: #FF0025;
	}

	.box {
		width: 100rpx;
		height: 100rpx;
		border: 1px solid #999999;
		border-radius: 12rpx;
		line-height: 100rpx;
		text-align: center;
		font-size: 36rpx;
	}

	.box.active {
		border: 1px solid #FF0025;
		color: #FF0025;
	}

	.cruise-empty {
		width: 100vw;
		height: 50vh;
		display: flex;
		justify-content: center;
		align-items: center;
		color: #999999;
		text-align: center;
		font-size: 24rpx;
		background: #FFFFFF;
	}
	.trackTitle{
		position: relative;
		border-left: 10rpx solid #FF0025;
		padding-left: 20rpx;
		margin-left: 20rpx;
		margin-bottom: 40rpx;
	}
	.trackTitle::before{
		position: absolute;
		width: 20rpx;
		height: 40rpx;
		background: #FF0025;
		left: 20rpx;
	}
	.watchPos{
		background: white;
		border-radius: 8rpx;
		border: 1rpx solid #FF0025;
		color: #FF0025;
		width: 85%;
		font-size: 26rpx;
		justify-content: center;
		display: flex;
		align-items: center;
		height: 80rpx;
		margin: auto;
		margin-top: 30rpx;
	}
    .cancel{
		border: 1rpx solid #cecece !important;
		position: fixed;
		left: 50%;
		right: 0;
		bottom: 20rpx;
		transform: translate(-50%);
		margin-top: 0rpx !important;
    }
	.senstive{
		position: absolute;
		right: 20rpx;
		bottom: 60rpx;
		width: 130rpx;
		border: 1rpx solid #999;
		background: white;
		padding-left: 10rpx;
		overflow: scroll;
		.item{
			border-bottom: 1rpx solid #cccccc;
			padding: 10rpx;
			font-size: 26rpx;
		}
	}
	.collapse{
		
	}
	.feedNum{
		width: 80rpx;
		height: 80rpx;
		border-radius: 40rpx;
		background: #FFFFFF;
		border: 1rpx solid #989898;
		color:#707070;
		font-size: 26rpx;
		margin: auto;
	}
	.activeFeed{
		width: 100rpx;
		height: 100rpx;
		border-radius: 50rpx;
		color: #2CBDB8;
		font-size: 36rpx;
		border: 1rpx solid #2CBDB8;
		font-weight: 800;
		
	}
	.choNum{
		text-align: center;
		color: #989898;
		font-size: 26rpx;
		margin-top: 10rpx;
	}
	.feedIcon{
		width: 150rpx;
		height: 150rpx;
		margin-bottom: 20rpx;
	}
	.scroll-view_H {
		white-space: nowrap;
		width: 100%;
	}
	.scroll-view-item {
		height: 300rpx;
		line-height: 300rpx;
		text-align: center;
		font-size: 36rpx;
	}
	.scroll-view-item_H {
		display: inline-block;
		width: 100%;
		height: 300rpx;
		line-height: 300rpx;
		text-align: center;
		font-size: 36rpx;
	}
	.cloudPanel{
		position: absolute;
		left: 0;
		right: 0;
		top: 10vh;
		height: 500rpx;
		background: #fff;
		z-index: 2;
		border-top: 1rpx solid #EEEEEE;
	}
	
		
</style>
